iOS模態懸浮層(模式)

從螢幕下方彈出的模態元件稱為浮層,動畫給使用者的隱喻是從一個模式切換到另外一個(或新的)

浮層的資訊隱喻作用

iOS13開始,目前已經變為預設通用控制元件。

A 優點:使用者可看到少量背景中露出的內容,屬於有效的內容感知,這個設計用來提示使用者之前在做什麼

B 浮層可以透過在螢幕上任意位置下滑來關閉。這種手勢的設計比點選關閉按鈕更容易操作

C 與滑動返回一樣,下拉關閉便於單手操作這在大螢幕裝置上尤為方便。當浮層中有可滑動的內容流時會與向下滑動的手勢互相沖突時。將內容滑動直到頂部就會觸發向下滑動浮層的手勢。

也可以直接在浮層頂部(固定的關閉觸發區域)向下滑動將其關閉

D 當出現以下情況時建議禁用該手勢:

浮層中帶有關鍵決策時(比如新增和儲存)應該被禁用。浮所以當你向下拉時會快速的回彈。如果使用者在離開浮層時必須做決策,可以彈出一個行動彈層,進行二次確認

E 浮層上的必要性操作:關閉按鈕仍舊是告知使用者可關閉的關鍵元素,原因是按鈕是易理解的且不是所有人都習慣和熟悉手勢操作。

當存在可滑動內容場景下,關閉按鈕是更方便的操作選擇,導航頂部加入儲存和取消按鈕也是同樣的原因

F 還有一些場景下不建議選擇浮層的互動方式。比如需要全屏(沉浸式)編輯圖片的場景(需要完整的空間和展示縮圖)

構建切換模式的清晰感知

模態視窗(浮層)主要目的是為了改變使用者的互動模式。浮層是為了構建使用者從一個模式切換到另外的模式的清晰感知

拿日曆應用舉例說明(瀏覽模式到決策模式)日曆有兩個模式:

1瀏覽模式(列表/表格)2決策模式(建立和編輯事項)

瀏覽模式下列表頁(父級)和詳情頁(子級),子級透過標題延續繼承父級資訊,子級是父級事情的任務或工作流程

當使用者對任務進行編輯或建立模式時,進入到了決策模式。浮層的設計準確向使用者傳達出當前已經進入到另外的(或新的)模式。